import { Component, OnInit, Input,  EventEmitter, ElementRef, Output} from '@angular/core';
import { ControlValueAccessor,NG_VALUE_ACCESSOR } from '@angular/forms';

@Component({
  selector: 'el-radio-group',
  templateUrl: './radio-group.component.html',
  providers: [{
      provide: NG_VALUE_ACCESSOR,
      useExisting: RadioGroupComponent,
      multi: true
  }], 
})
export class RadioGroupComponent implements OnInit,  ControlValueAccessor {
    @Input() disabled: boolean = false;
    @Input() buttonSize: string = '';
    @Input() fillColor: string = '#20a0ff';
    @Input() textColor: string = '#ffffff';
    @Input() model: any;
    @Output() modelChange: EventEmitter<any> = new EventEmitter();
    @Input() subscriber: Function[] = [];
    private controlChange:any = function () { };
    private controlTouch:any = function () { };
  
  constructor(el: ElementRef) { }

  writeValue(value: any): void {
    this.model = value;
    this.changeHandle(this.model);
  }
  registerOnChange(fn: any): void {
    this.controlChange = fn;
  }
  registerOnTouched(fn: any): void {
    this.controlTouch = fn;
  }

  changeHandle(nextValue:any) {
    this.model = nextValue;
    this.modelChange.emit(nextValue);
    this.controlChange(nextValue);
    this.subscriber.forEach(function (sub) { return sub(); });
  }

  

  ngOnInit(): void {
  }

}
